<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>老人健康信息</title>
		<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
	</head>
	<body>
		<article>
		<div class="container-fluid">
			<div class="row-fluid">
				<div class="span12">
					<div class="row-fluid">
						<div class="span12">
							<ul class="breadcrumb">
								<li>
									<a href="#">主页</a> <span class="divider">/</span>
								</li>
								<li>
									<a href="#">类目</a> <span class="divider">/</span>
								</li>
								<li class="active">
									主题
								</li>
							</ul>
						</div>
					</div>
					<menu style="text-align: center;">
						<input v-model="key" type="text" placeholder="请输入查询条件">
						<button @click="gotoPage" class="primary">查询</button>
						<a class="btn btn-info" type="button" href="elderhealthadd.html">添加</a>
					</menu>
					<div class="row-fluid">
						<div class="span12">
							<table class="data">
								<thead>
									<tr>
										<th>序号</th>
										<th>医生</th>
										<th>老人</th>
										<th>老人健康情况</th>
										<th>老人饮食注意</th>
										<th>检查时间</th>
										<th>操作</th>
									</tr>
								</thead>
								<tbody id="rowsEL" v-if="result!=null">
									<tr v-for="(row,i) in result.rows">
										<td>{{i+1}}</td>
										<td>{{row.doctorId}}</td>
										<td>{{row.elderId}}</td>
										<td>{{row.bodyCondition}}</td>
										<td>{{row.elderDiet}}</td>
										<td>{{row.checkTime}}</td>
										<td><button :value="row.id" @click="toclearview($event)" class="btn btn-group-lg">查看</button></td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="row-fluid">
						<div class="span6">
						</div>
						<div class="span6">
							<div class="pagination">
								<ul>
									<li>
										<a href="#">上一页</a>
									</li>
									<li>
										<a href="#">1</a>
									</li>
									<li>
										<a href="#">2</a>
									</li>
									<li>
										<a href="#">3</a>
									</li>
									<li>
										<a href="#">4</a>
									</li>
									<li>
										<a href="#">5</a>
									</li>
									<li>
										<a href="#">下一页</a>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		</article>
		<script src="http://code.jquery.com/jquery.js"></script>
		<script src="js/bootstrap.min.js"></script>
		<script src="../../common/axios.min.js"></script>
		<script src="../../common/vue.js"></script>
		<script>
			const app = new Vue({
				el: "body>article",
				data: {
					key: null,
					result: null

				},
				methods: {
					gotoPage: function() {
						axios.get("/elderhealth", {
								params: {
									key: this.key,
								}
							})
							.then(function(resp) {
								if(resp.code === "ok") {
									app.result = resp.data;
								} else {
									console.log(resp.message)
								}
							});
					},
					toclearview: function(evt) {
						let id = evt.target.value;
						sessionStorage.setItem("id", id);
						window.location = "clearview.html";
					}
				}
			});
		</script>
	</body>

</html>